<!doctype html>
<html lang="en">
<head>
    <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <title>Metorik - Responsive Bootstrap 4 Admin Dashboard Template</title>
    <!-- Favicon -->
    <link rel="shortcut icon" href="../src/images/favicon.ico"/>
    <!-- Bootstrap CSS -->
    <link rel="stylesheet" href="../src/css/bootstrap.min.css">
    <!-- Typography CSS -->
    <link rel="stylesheet" href="../src/css/typography.css">
    <!-- Style CSS -->
    <link rel="stylesheet" href="../src/css/style.css">
    <!-- Responsive CSS -->
    <link rel="stylesheet" href="../src/css/responsive.css">
</head>
<body>
<!-- loader Start -->
<div id="loading">

</div>
<!-- loader END -->
<!-- Wrapper Start -->
<div class="wrapper">
    <!-- Sidebar  -->
    <div class="iq-sidebar">
        <div class="iq-sidebar-logo d-flex justify-content-between">
            <a href="index.html">
                <img src="../src/images/logo.gif" class="img-fluid" alt="">
                <span>DaLao</span>
            </a>
            <div class="iq-menu-bt align-self-center">
                <div class="wrapper-menu">
                    <div class="line-menu half start"></div>
                    <div class="line-menu"></div>
                    <div class="line-menu half end"></div>
                </div>
            </div>
        </div>
        <div id="sidebar-scrollbar">
            <div id="menu"></div>
            <div class="p-3"></div>
        </div>
    </div>
    <!-- TOP Nav Bar -->
    <div class="iq-top-navbar">
        <div class="iq-navbar-custom">
            <div class="iq-sidebar-logo">
                <div class="top-logo">
                    <a href="index.html" class="logo">
                        <img src="../src/images/logo.gif" class="img-fluid" alt="">
                        <span>DaLao</span>
                    </a>
                </div>
            </div>
            <div class="navbar-breadcrumb">
                <h5 class="mb-0">图标-dripicons</h5>
                <nav aria-label="breadcrumb">
                    <ul class="breadcrumb">
                        <li class="breadcrumb-item"><a href="index.html">主页</a></li>
                        <li class="breadcrumb-item active" aria-current="page">图标-dripicons</li>
                    </ul>
                </nav>
            </div>
            <div id="navigation"></div>
        </div>
    </div>
    <!-- TOP Nav Bar END -->
    <!-- Page Content  -->
    <div id="content-page" class="content-page">
        <div class="container-fluid">
            <div class="row">
                <div class="col-sm-12">
                    <div class="iq-card">
                        <div class="iq-card-header d-flex justify-content-between">
                            <div class="iq-header-title">
                                <h4 class="card-title">Dripicons 图标</h4>
                            </div>

                        </div>
                        <div class="iq-card-body">
                            <div class="row mt-3">
                                <div class="col-sm-6 col-md-4 col-lg-3 col-xl-2">
                                    <a class="iq-icons-list" href="#">
                                        <div data-icon="a" class="icon"></div>
                                        <span>闹钟</span></a>
                                </div>
                                <div class="col-sm-6 col-md-4 col-lg-3 col-xl-2">
                                    <a class="iq-icons-list" href="#">
                                        <div data-icon="o" class="icon"></div>
                                        <span>上箭头</span></a>
                                </div>
                                <div class="col-sm-6 col-md-4 col-lg-3 col-xl-2">
                                    <a class="iq-icons-list" href="#">
                                        <div data-icon="h" class="icon"></div>
                                        <span>下箭头</span></a>
                                </div>
                                <div class="col-sm-6 col-md-4 col-lg-3 col-xl-2">
                                    <a class="iq-icons-list" href="#">
                                        <div data-icon="j" class="icon"></div>
                                        <span>左箭头</span></a>
                                </div>
                                <div class="col-sm-6 col-md-4 col-lg-3 col-xl-2">
                                    <a class="iq-icons-list" href="#">
                                        <div data-icon="i" class="icon"></div>
                                        <span>右箭头</span></a>
                                </div>
                                <div class="col-sm-6 col-md-4 col-lg-3 col-xl-2">
                                    <a class="iq-icons-list" href="#">
                                        <div data-icon="l" class="icon"></div>
                                        <span>左</span></a>
                                </div>
                                <div class="col-sm-6 col-md-4 col-lg-3 col-xl-2">
                                    <a class="iq-icons-list" href="#">
                                        <div data-icon="k" class="icon"></div>
                                        <span>向下</span></a>
                                </div>
                                <div class="col-sm-6 col-md-4 col-lg-3 col-xl-2">
                                    <a class="iq-icons-list" href="#">
                                        <div data-icon="n" class="icon"></div>
                                        <span>向上</span></a>
                                </div>
                                <div class="col-sm-6 col-md-4 col-lg-3 col-xl-2">
                                    <a class="iq-icons-list" href="#">
                                        <div data-icon="m" class="icon"></div>
                                        <span>向右</span></a>
                                </div>
                                <div class="col-sm-6 col-md-4 col-lg-3 col-xl-2">
                                    <a class="iq-icons-list" href="#">
                                        <div data-icon="f" class="icon"></div>
                                        <span>锚</span></a>
                                </div>
                                <div class="col-sm-6 col-md-4 col-lg-3 col-xl-2">
                                    <a class="iq-icons-list" href="#">
                                        <div data-icon="g" class="icon"></div>
                                        <span>文件</span></a>
                                </div>
                                <div class="col-sm-6 col-md-4 col-lg-3 col-xl-2">
                                    <a class="iq-icons-list" href="#">
                                        <div data-icon="p" class="icon"></div>
                                        <span>记事本</span></a>
                                </div>
                                <div class="col-sm-6 col-md-4 col-lg-3 col-xl-2">
                                    <a class="iq-icons-list" href="#">
                                        <div data-icon="s" class="icon"></div>
                                        <span>篮球</span></a>
                                </div>
                                <div class="col-sm-6 col-md-4 col-lg-3 col-xl-2">
                                    <a class="iq-icons-list" href="#">
                                        <div data-icon="K" class="icon"></div>
                                        <span>下载</span></a>
                                </div>
                                <div class="col-sm-6 col-md-4 col-lg-3 col-xl-2">
                                    <a class="iq-icons-list" href="#">
                                        <div data-icon="G" class="icon"></div>
                                        <span>太阳</span></a>
                                </div>
                                <div class="col-sm-6 col-md-4 col-lg-3 col-xl-2">
                                    <a class="iq-icons-list" href="#">
                                        <div data-icon="H" class="icon"></div>
                                        <span>半光</span></a>
                                </div>
                                <div class="col-sm-6 col-md-4 col-lg-3 col-xl-2">
                                    <a class="iq-icons-list" href="#">
                                        <div data-icon="F" class="icon"></div>
                                        <span>光</span></a>
                                </div>
                                <div class="col-sm-6 col-md-4 col-lg-3 col-xl-2">
                                    <a class="iq-icons-list" href="#">
                                        <div data-icon="I" class="icon"></div>
                                        <span>声音</span></a>
                                </div>
                                <div class="col-sm-6 col-md-4 col-lg-3 col-xl-2">
                                    <a class="iq-icons-list" href="#">
                                        <div data-icon="x" class="icon"></div>
                                        <span>通知</span></a>
                                </div>
                                <div class="col-sm-6 col-md-4 col-lg-3 col-xl-2">
                                    <a class="iq-icons-list" href="#">
                                        <div data-icon="J" class="icon"></div>
                                        <span></span>页码</a>
                                </div>
                                <div class="col-sm-6 col-md-4 col-lg-3 col-xl-2">
                                    <a class="iq-icons-list" href="#">
                                        <div data-icon="t" class="icon"></div>
                                        <span>电池没电</span></a>
                                </div>
                                <div class="col-sm-6 col-md-4 col-lg-3 col-xl-2">
                                    <a class="iq-icons-list" href="#">
                                        <div data-icon="u" class="icon"></div>
                                        <span>电池满电</span></a>
                                </div>
                                <div class="col-sm-6 col-md-4 col-lg-3 col-xl-2">
                                    <a class="iq-icons-list" href="#">
                                        <div data-icon="v" class="icon"></div>
                                        <span>一格电池</span></a>
                                </div>
                                <div class="col-sm-6 col-md-4 col-lg-3 col-xl-2">
                                    <a class="iq-icons-list" href="#">
                                        <div data-icon="w" class="icon"></div>
                                        <span>二格电池</span></a>
                                </div>
                                <div class="col-sm-6 col-md-4 col-lg-3 col-xl-2">
                                    <a class="iq-icons-list" href="#">
                                        <div data-icon="Q" class="icon"></div>
                                        <span>购物车</span></a>
                                </div>
                                <div class="col-sm-6 col-md-4 col-lg-3 col-xl-2">
                                    <a class="iq-icons-list" href="#">
                                        <div data-icon="P" class="icon"></div>
                                        <span>卡片</span></a>
                                </div>
                                <div class="col-sm-6 col-md-4 col-lg-3 col-xl-2">
                                    <a class="iq-icons-list" href="#">
                                        <div data-icon="O" class="icon"></div>
                                        <span>相机</span></a>
                                </div>
                                <div class="col-sm-6 col-md-4 col-lg-3 col-xl-2">
                                    <a class="iq-icons-list" href="#">
                                        <div data-icon="N" class="icon"></div>
                                        <span>视频</span></a>
                                </div>
                                <div class="col-sm-6 col-md-4 col-lg-3 col-xl-2">
                                    <a class="iq-icons-list" href="#">
                                        <div data-icon="S" class="icon"></div>
                                        <span>检查</span></a>
                                </div>
                                <div class="col-sm-6 col-md-4 col-lg-3 col-xl-2">
                                    <a class="iq-icons-list" href="#">
                                        <div data-icon="T" class="icon"></div>
                                        <span>向下倾斜</span></a>
                                </div>
                                <div class="col-sm-6 col-md-4 col-lg-3 col-xl-2">
                                    <a class="iq-icons-list" href="#">
                                        <div data-icon="U" class="icon"></div>
                                        <span>向左倾斜</span></a>
                                </div>
                                <div class="col-sm-6 col-md-4 col-lg-3 col-xl-2">
                                    <a class="iq-icons-list" href="#">
                                        <div data-icon="V" class="icon"></div>
                                        <span>向右倾斜</span></a>
                                </div>
                                <div class="col-sm-6 col-md-4 col-lg-3 col-xl-2">
                                    <a class="iq-icons-list" href="#">
                                        <div data-icon="W" class="icon"></div>
                                        <span>向上倾斜</span></a>
                                </div>
                                <div class="col-sm-6 col-md-4 col-lg-3 col-xl-2">
                                    <a class="iq-icons-list" href="#">
                                        <div data-icon="X" class="icon"></div>
                                        <span>向上箭头</span></a>
                                </div>
                                <div class="col-sm-6 col-md-4 col-lg-3 col-xl-2">
                                    <a class="iq-icons-list" href="#">
                                        <div data-icon="Y" class="icon"></div>
                                        <span>时钟</span></a>
                                </div>
                                <div class="col-sm-6 col-md-4 col-lg-3 col-xl-2">
                                    <a class="iq-icons-list" href="#">
                                        <div data-icon="Z" class="icon"></div>
                                        <span>重新加载</span></a>
                                </div>
                                <div class="col-sm-6 col-md-4 col-lg-3 col-xl-2">
                                    <a class="iq-icons-list" href="#">
                                        <div data-icon="0" class="icon"></div>
                                        <span>云</span></a>
                                </div>
                                <div class="col-sm-6 col-md-4 col-lg-3 col-xl-2">
                                    <a class="iq-icons-list" href="#">
                                        <div data-icon="1" class="icon"></div>
                                        <span>云下载</span></a>
                                </div>
                                <div class="col-sm-6 col-md-4 col-lg-3 col-xl-2">
                                    <a class="iq-icons-list" href="#">
                                        <div data-icon="2" class="icon"></div>
                                        <span>云上传</span></a>
                                </div>
                                <div class="col-sm-6 col-md-4 col-lg-3 col-xl-2">
                                    <a class="iq-icons-list" href="#">
                                        <div data-icon="5" class="icon"></div>
                                        <span>箭头</span></a>
                                </div>
                                <div class="col-sm-12 text-center mt-3">
                                    <a class="btn btn-primary" href="http://demo.amitjakhu.com/dripicons/"
                                       target="blank">查看所有图标</a>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<!-- Wrapper END -->
<div id="bottom"></div>
</body>
<!-- Footer END -->
<!-- Optional JavaScript -->
<!-- jQuery first, then Popper.js, then Bootstrap JS -->
<script src="../src/js/jquery.min.js"></script>
<script src="../src/js/popper.min.js"></script>
<script src="../src/js/bootstrap.min.js"></script>
<!-- Appear JavaScript -->
<script src="../src/js/jquery.appear.js"></script>
<!-- Countdown JavaScript -->
<script src="../src/js/countdown.min.js"></script>
<!-- Counterup JavaScript -->
<script src="../src/js/waypoints.min.js"></script>
<script src="../src/js/jquery.counterup.min.js"></script>
<!-- Wow JavaScript -->
<script src="../src/js/wow.min.js"></script>
<!-- Apexcharts JavaScript -->
<script src="../src/js/apexcharts.js"></script>
<!-- Select2 JavaScript -->
<script src="../src/js/select2.min.js"></script>
<!-- Owl Carousel JavaScript -->
<script src="../src/js/owl.carousel.min.js"></script>
<!-- Magnific Popup JavaScript -->
<script src="../src/js/jquery.magnific-popup.min.js"></script>
<!-- Smooth Scrollbar JavaScript -->
<script src="../src/js/smooth-scrollbar.js"></script>
<!-- lottie JavaScript -->
<script src="../src/js/lottie.js"></script>
<!-- Chart Custom JavaScript -->
<script src="../src/js/chart-custom.js"></script>
<!-- Custom JavaScript -->
<script src="../src/js/custom.js"></script>
<script>
    $(function () {
        $("#menu").load("menus.html");
        $("#navigation").load("navigation-bar.html");
        $("#bottom").load("bottom-bar.html");
    });
</script>
</html>